<template>
  <pageTabelLayout>
    <template #pageTabel>
      <a-spin :loading="pageLoading.value" tip="加载中" dot style="height:99%;width: 100%;z-index:999 ;">
        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple"
                         @grid-ready="gridReady" style="height:calc(100% - 45px )" class='ag-theme-alpine'
                         :defaultColDef="defaultColDef"
                         :rowData="table.dataList" :columnDefs="cfsValue" :localeText="localeTextData"
                         @columnResized="onColumnResized"
                         @columnMoved="onColumnMoved"/>
      </a-spin>
    </template>
  </pageTabelLayout>
  <!-- <paginationCopys :total="total" show-total show-jumper
      show-page-size @change="changePage"  @page-size-change="changeSize"
      style="justify-content: center;margin-top: 10px;"  :page-size="pagination.pageSize"
      :current="pagination.page" /> -->
</template>

<script lang="ts">

import emitter from "@/hooks/useEventBus";
import {localeText} from '@/api/aggridZw'
import {onMounted, reactive, ref} from 'vue';
import {Message} from '@arco-design/web-vue';
import {usePagination, useTable} from '@/hooks/table';
import {statis} from '@/api/DyeingshopManagement/lifeStatis'
import {saveOrUpdateGridState as saveOrUpdateGridState01} from '@/hooks/useGridState'

export default {
  name: 'gather',
  components: {},
  props: {
    searchData: {
      type: Object,
      default: () => {
      }
    }
  },
  setup(props) {
    const pageLoading = ref(false)
    const table = useTable();
    const statiscApi = statis();
    emitter.on("refresh-gather", () => {
      pagination.page = 1;
      doRefresh();
    });

    const doRefresh = async () => {
      pageLoading.value = true
      updateGridState01()
      let res = await statiscApi.getStaticReport({...props.searchData});

      if (res.code == 200) {
        let gatherList: any = [];
        let dataList = res.data.list;
        /**
         * 数据整合
         */
        for (let key in dataList) {
          for (let dKey in dataList[key]) {
            if (dataList[key][dKey].length > 0) {
              dataList[key][dKey].map((item: any) => {
                gatherList.push({
                  [`${key}_${dKey}_quantity`]: item.quantity,
                  [`${key}_${dKey}_percentage`]: item.percentage,
                  customName: item.customName,
                  createTime: item.createTime
                })
              });
            }

          }
        }
        ;
        /**
         * 数据合并
         */
        let NewGatherList = gatherList.reduce((p: any, c: any) => {
          if (p.find((item: any) => item.customName === c.customName && item.createTime === c.createTime)) {
            Object.assign(p.find((item: any) => item.customName === c.customName && item.createTime === c.createTime), c)
          } else {
            p.push(c)
          }
          return p
        }, []);
        table.handleSuccess(NewGatherList);
        gridOption.value.setRowData(NewGatherList);
      } else {
        Message.error({
          content: "数据查询失败",
          duration: 5000,
        });
      }
      pageLoading.value = false
    };
    emitter.on('export-gather', () => {
      let selectList = gridOption.value.getSelectedRows();
      // console.log(selectList);
      if (selectList.length === 0) {
        Message.error('请勾选需要导出的数据')
        return
      } else {
        //导出数据
        let head = `
                   <thead>
                      <tr>
                        <th rowspan="4">付运日期</th>
                        <th rowspan="4">客户名称</th>
                        <th colspan="14">染部周期</th>
                        <th colspan="14">定型周期</th>
                        <th rowspan="2" colspan="7">特整周期</th>
                        <th rowspan="2" colspan="5">品控周期</th>
                        <th rowspan="2" colspan="5">发货生产周期</th>
                      </tr>
                      <tr>
                        <th colspan="7">A车间</th>  
                        <th colspan="7">B车间</th>  
                        <th colspan="7">A车间</th>  
                        <th colspan="7">B车间</th>  
                      </tr>
                      <tr>
                        <th colspan="2">生产0-3天</th>
                        <th colspan="2">生产3-5.5天</th>
                        <th colspan="2">5.5天以上</th>
                        <th>全部</th>
                        <th colspan="2">生产0-1天</th>
                        <th colspan="2">生产1-2天</th>
                        <th colspan="2">2天以上</th>
                        <th>全部</th>
                        <th colspan="2">生产0-1天</th>
                        <th colspan="2">生产1-2天</th>
                        <th colspan="2">2天以上</th>
                        <th>全部</th>
                        <th colspan="2">生产0-1天</th>
                        <th colspan="2">生产1-2天</th>
                        <th colspan="2">2天以上</th>
                        <th>全部</th>
                        <th colspan="2">生产0.017天</th>
                        <th colspan="2">生产0.17天</th>
                        <th>全部</th>
                        <th colspan="2">生产0.15天</th>
                        <th colspan="2">生产1.5天</th>
                        <th>全部</th>
                        <th colspan="2">生产0-4天</th>
                        <th colspan="2">生产5-8天</th>
                        <th>全部</th>
                      </tr>
                      <tr>
                        <th>缸数</th> 
                        <th>比例</th> 
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>缸数</th> 
                        <th>比例</th> 
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>缸数</th> 
                        <th>比例</th> 
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>缸数</th> 
                        <th>比例</th> 
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>缸数</th> 
                        <th>比例</th> 
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>缸数</th> 
                        <th>比例</th> 
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th> 
                        <th>缸数</th> 
                        <th>比例</th> 
                        <th>缸数</th> 
                        <th>比例</th>
                        <th>缸数</th>  
                      </tr>
                   </thead>
                `
        let body = "";
        selectList.forEach(function (o: any) {
          body += "<tr><td>" + (o["createTime"] ?? '') + "</td>";
          body += "<td>" + (o["customName"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm03A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm03A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarmMap0355A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarmMap0355A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm55A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm55A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarmA_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm03B_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm03B_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm355B_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm355B_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm55B_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarm55B_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["dyeFarm_dyeFarmB_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm01A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm01A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarmMap12A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarmMap12A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm2A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm2A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarmA_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm01B_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm01B_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm12B_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm12B_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm2B_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarm2B_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["definitive_dyeFarmB_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["special_dyeFarm01A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["special_dyeFarm01A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["special_dyeFarmMap12A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["special_dyeFarmMap12A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["special_dyeFarm2A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["special_dyeFarm2A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["special_dyeFarmA_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["daySpecial_dyeFarm01A__quantity"] ?? '') + "</td>";
          body += "<td>" + (o["daySpecial_dyeFarm01A__percentage"] ?? '') + "</td>";
          body += "<td>" + (o["daySpecial_dyeFarm02A__quantity"] ?? '') + "</td>";
          body += "<td>" + (o["daySpecial_dyeFarm02A__percentage"] ?? '') + "</td>";
          body += "<td>" + (o["daySpecial_dyeFarmA_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["qualityControl_dyeFarm01A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["qualityControl_dyeFarm01A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["qualityControl_dyeFarmMap12A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["qualityControl_dyeFarmMap12A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["qualityControl_dyeFarmA_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["productionCycle_dyeFarm04A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["productionCycle_dyeFarm04A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["productionCycle_dyeFarmMap58A_quantity"] ?? '') + "</td>";
          body += "<td>" + (o["productionCycle_dyeFarmMap58A_percentage"] ?? '') + "</td>";
          body += "<td>" + (o["productionCycle_dyeFarmA_quantity"] ?? '') + "</td>";
          body += "</tr>";
        })
        tableToXlsx(head, '生产周期汇总', body)
      }
    });

    //导出


    function tableToXlsx(head: any, filename: any, body: any) {
      const uri = 'data:application/vnd.ms-excel;base64,',
          template = `<html>
        <head><meta charset="UTF-8"></head>
        <body><table border="1">${head}${body}</table></body>
    </html>`;

      try {
        const a = document.createElement('a');
        a.href = uri + window.btoa(unescape(encodeURIComponent(template)));
        a.download = filename;
        a.click();
        document.removeChild(a);
      } catch (e) {
      }
    }


    const pagination = usePagination(doRefresh);
    //表格方面
    const gridOption = ref();
    const colState = ref()
    const gridReady = (params: any) => {
      gridOption.value = params.api;
      colState.value = params.columnApi
      //调整表格自适应大小
    }
    const defaultColDef = {
      sortable: true,
      resizable: true,
      filter: true,
      width: 150
    };
    let cfsValue: any = [
      {
        headerName: "付运日期",
        field: "createTime",
      },
      {
        headerName: "客户名称",
        field: "customName",
      },
      {
        headerName: "染部周期",
        children: [
          {
            headerName: "A车间",
            children: [
              {
                headerName: '生产0-3天',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarm03A_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "dyeFarm_dyeFarm03A_percentage",
                  },
                ]
              },
              {
                headerName: '生产3-5.5天',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarmMap0355A_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "dyeFarm_dyeFarmMap0355A_percentage",
                  },
                ]
              },
              {
                headerName: '5.5天以上',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarm55A_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "dyeFarm_dyeFarm55A_percentage",
                  },
                ]
              },
              {
                headerName: '全部',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarmA_quantity",
                  },
                ]
              }
            ]
          },
          {
            headerName: "B车间",
            children: [
              {
                headerName: '生产0-3天',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarm03B_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "dyeFarm_dyeFarm03B_percentage",
                  },
                ]
              },
              {
                headerName: '生产3-5.5天',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarm355B_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "dyeFarm_dyeFarm355B_percentage",
                  },
                ]
              },
              {
                headerName: '5.5天以上',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarm55B_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "dyeFarm_dyeFarm55B_percentage",
                  },
                ]
              },
              {
                headerName: '全部',
                children: [
                  {
                    headerName: '缸数',
                    field: "dyeFarm_dyeFarmB_quantity",
                  },
                ]
              }
            ]
          }
        ]
      },
      {
        headerName: "定型周期",
        children: [
          {
            headerName: "A车间",
            children: [
              {
                headerName: '生产0-1天',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarm01A_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "definitive_dyeFarm01A_percentage",
                  },
                ]
              },
              {
                headerName: '生产1-2天',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarmMap12A_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "definitive_dyeFarmMap12A_percentage",
                  },
                ]
              },
              {
                headerName: '2天以上',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarm2A_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "definitive_dyeFarm2A_percentage",
                  },
                ]
              },
              {
                headerName: '全部',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarmA_quantity",
                  },
                ]
              }
            ]
          },
          {
            headerName: "B车间",
            children: [
              {
                headerName: '生产0-1天',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarm01B_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "definitive_dyeFarm01B_percentage",
                  },
                ]
              },
              {
                headerName: '生产1-2天',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarm12B_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "definitive_dyeFarm12B_percentage",
                  },
                ]
              },
              {
                headerName: '2天以上',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarm2B_quantity",
                  },
                  {
                    headerName: '比例',
                    field: "definitive_dyeFarm2B_percentage",
                  },
                ]
              },
              {
                headerName: '全部',
                children: [
                  {
                    headerName: '缸数',
                    field: "definitive_dyeFarmB_quantity",
                  },
                ]
              }
            ]
          }
        ]
      },
      {
        headerName: "特整周期",
        children: [
          {
            headerName: '生产0-1天',
            children: [
              {
                headerName: '缸数',
                field: "special_dyeFarm01A_quantity",
              },
              {
                headerName: '比例',
                field: "special_dyeFarm01A_percentage",
              },
            ]
          },
          {
            headerName: '生产1-2天',
            children: [
              {
                headerName: '缸数',
                field: "special_dyeFarmMap12A_quantity",
              },
              {
                headerName: '比例',
                field: "special_dyeFarmMap12A_percentage",
              },
            ]
          },
          {
            headerName: '2天以上',
            children: [
              {
                headerName: '缸数',
                field: "special_dyeFarm2A_quantity",
              },
              {
                headerName: '比例',
                field: "special_dyeFarm2A_percentage",
              },
            ]
          },
          {
            headerName: '全部',
            children: [
              {
                headerName: '缸数',
                field: "special_dyeFarmA_quantity",
              },
            ]
          }
        ]
      },
      {
        headerName: "批色周期",
        children: [
          {
            headerName: '生产0.017天',
            children: [
              {
                headerName: '缸数',
                field: "daySpecial_dyeFarm01A__quantity",
              },
              {
                headerName: '比例',
                field: "daySpecial_dyeFarm01A__percentage",
              },
            ]
          },
          {
            headerName: '生产0.17天以上',
            children: [
              {
                headerName: '缸数',
                field: "daySpecial_dyeFarm02A__quantity",
              },
              {
                headerName: '比例',
                field: "daySpecial_dyeFarm02A__percentage",
              },
            ]
          },
          {
            headerName: '全部',
            children: [
              {
                headerName: '缸数',
                field: "daySpecial_dyeFarmA_quantity",
              },
            ]
          }
        ]
      },
      {
        headerName: "品控周期",
        children: [
          {
            headerName: '生产0.015天',
            children: [
              {
                headerName: '缸数',
                field: "qualityControl_dyeFarm01A_quantity",
              },
              {
                headerName: '比例',
                field: "qualityControl_dyeFarm01A_percentage",
              },
            ]
          },
          {
            headerName: '1.5天以上',
            children: [
              {
                headerName: '缸数',
                field: "qualityControl_dyeFarmMap12A_quantity",
              },
              {
                headerName: '比例',
                field: "qualityControl_dyeFarmMap12A_percentage",
              },
            ]
          },
          {
            headerName: '全部',
            children: [
              {
                headerName: '缸数',
                field: "qualityControl_dyeFarmA_quantity",
              },
            ]
          }
        ]
      },
      {
        headerName: "发货生产周期(巨丰单)",
        children: [
          {
            headerName: '生产0-4天',
            children: [
              {
                headerName: '缸数',
                field: "productionCycle_dyeFarm04A_quantity",
              },
              {
                headerName: '比例',
                field: "productionCycle_dyeFarm04A_percentage",
              },
            ]
          },
          {
            headerName: '生产5-8天',
            children: [
              {
                headerName: '缸数',
                field: "productionCycle_dyeFarmMap58A_quantity",
              },
              {
                headerName: '比例',
                field: "productionCycle_dyeFarmMap58A_percentage",
              },
            ]
          },
          {
            headerName: '总缸数',
            children: [{
              headerName: '缸数',
              field: "productionCycle_dyeFarmA_quantity",
            }]
          }
        ]
      },
    ];
    let a = [{
      showRowGroup: 'hide_def',
      "headerName": "",
      "checkboxSelection": true,
      "headerCheckboxSelection": true,
      "pinned": "left",
      "width": 50,
      resizable: false,
      filter: false,
      sortable: false,
      minWidth: 50,
      maxWidth: 50,
      lockPosition: "left",
    }]
    cfsValue = a.concat(cfsValue);
    const total = ref(10);
    const changePage = (val: any) => {
      pagination.page = val
      doRefresh();
    }
    const changeSize = (val: any) => {
      pagination.pageSize = val
      doRefresh();
    };
    const localeTextData: any = ref(localeText);
    const {saveGridState: saveGridState01, updateGridState: updateGridState01} = saveOrUpdateGridState01('gather01', gridOption, colState, cfsValue)
    const onColumnMoved = () => {
      saveGridState01()
    }
    const onColumnResized = () => {
      saveGridState01()
    }
    return {
      saveOrUpdateGridState01,
      saveGridState01,
      updateGridState01,
      onColumnMoved,
      onColumnResized,
      colState,
      pageLoading,
      pagination,
      table,
      localeTextData,
      changePage,
      changeSize,
      total,
      cfsValue,
      defaultColDef,
      gridReady,
    }
  },
}
</script>

<style scoped></style>